<!DOCTYPE html>
<html lang="en">

<head>
	<title>three.js webgl - skinning and morphing</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
	<link type="text/css" rel="stylesheet" href="../main.css">
	<style>
		body {
			color: #222;
		}

		a {
			color: #2fa1d6;
		}

		p {
			max-width: 600px;
			margin-left: auto;
			margin-right: auto;
			padding: 0 2em;
		}
	</style>
</head>

<body>
	<div id="info">
		<a href="https://threejs.org" target="_blank" rel="noopener">three.js</a> webgl - skinning and morphing<br />
		<p>
			The animation system allows clips to be played individually, looped, or crossfaded with other clips. This
			example shows a character looping in one of several base animation states, then transitioning smoothly to
			one-time actions. Facial expressions are controlled independently with morph targets.
		</p>
		Model by
		<a href="https://www.patreon.com/quaternius" target="_blank" rel="noopener">Tomás Laulhé</a>,
		modifications by <a href="https://donmccurdy.com/" target="_blank" rel="noopener">Don McCurdy</a>. CC0.<br />
	</div>


	<script type="module" src="./webgl_animation_skinning_morph.ts"></script>

</body>

</html>